<template>
	<view class="page">
		<view class="head">
			<view class="job-enterprise-back" @click="back()"><u-icon name="arrow-left" color="#000000" label="返回" labelSize="26rpx" labelColor="#000000"></u-icon></view>
			<view class="job-enterprise-title">名企招聘</view>
			<view class="job-enterprise-class" :class="{ job_enterprise_class_active: isShowScreenList }" @click="showScreenList()">{{ screenList.title }}</view>
		</view>
		<u-gap height="2" bgColor="#f5f5f5"></u-gap>
		<!-- 筛选下拉开始 -->
		<view class="job-enterprise-screen" v-show="isShowScreenList">
			<view class="job-enterprise-screen-list" style="height: auto; max-height: 100%; overflow: auto;">
				<view class="job-enterprise-screen-item" v-for="(item, index) in screenList.data" :key="index">
					<view @click="selectScreenItem(index)" :class="{ active: item.status }">{{ item.text }}</view>
				</view>
			</view>
		</view>
		<!-- 筛选拉结束 -->
		<view class="body">
			<view class="job-enterprise-list">
				<block v-for="(item, index) in enterprisesList" :key="index">
					<view class="job-enterprise-item" @click="goToCompanyShow(item.ID)">
						<view class="job-enterprise-item-avatar">
							<u-avatar :src="$getImgUrl(item.LogoImg)" shape="square" size="133rpx"></u-avatar>
						</view>
						<view class="job-enterprise-item-info">
							<view class="job-enterprise-item-info-title">
								{{ item.QYName }}
							</view>
							<view class="job-enterprise-item-info-tag">
								<view class="job-enterprise-item-info-tag-item">
									<u-tag :text="item.QYGM + '人'" bgColor="#f7d9da" color="#c8000a" size="mini" type="warning"></u-tag>
								</view>
								<view class="job-enterprise-item-info-tag-item">
									<u-tag :text="item.QYHY" bgColor="#f7d9da" color="#c8000a" size="mini" type="warning"></u-tag>
								</view>
							</view>
							<view class="job-enterprise-info-address">
								<u-icon name="map-fill" color="#999999" size="27rpx" :label="item.Address" labelSize="24rpx" labelColor="#999999"></u-icon>
							</view>
						</view>
						<view class="job-enterprise-item-number">
							{{ item.ZPCount }}个招聘
						</view>
					</view>
					<u-gap height="5" bgColor="#f5f5f5"></u-gap>
				</block>
				<u-loadmore :status="loadMoreStatus" loading-text="努力加载中..." loadmore-text="上拉加载" nomore-text="没有更多信息..." />
			</view>
		</view>

		<view class="bottom">
			<!-- 最下方盒子用户设置安全高度 -->
		</view>
		<!-- 自定义底部导航菜单开始 -->
		<JobTabbar :selectIndex="jobTabbarIndex"></JobTabbar>
		<!-- 自定义底部导航菜单结束 -->
		
	</view>
</template>

<script>
import JobTabbar from '@/components/JobTabbar/JobTabbar.vue';
export default {
	data() {
		return {
			jobTabbarIndex: 1, // 底部菜单默认选中按钮
			thisPage: 1, // 当前默认翻页
			thisAllPage: 1, //当前全部页面
			enterprisesList: [], // 企业列表
			//下拉菜单对象
			screenList: {
				title: '行类分类',
				data: [
					{ text: '不限', identity: 0, status: true }
				]
			},
			isShowScreenList: false, // 筛选菜单显示状态
			result: [], // 筛选结果数组
			screenResult: {}, // 存储筛选对象
			loadMoreStatus: 'loading',
			
		};
	},
	onLoad() {
		this.getJobEnterPrisesList()
	},
	// 下拉刷新
	async onPullDownRefresh() {
		this.init()
		await this.getJobEnterPrisesList()
		setTimeout(() => {
			uni.stopPullDownRefresh()
			// console.log('停止下拉刷新')
		}, 1000);
	},
	//上拉加载
	onReachBottom() {
		this.loadMoreStatus = 'loadmore'
		if(this.thisPage < this.thisAllPage){
			this.thisPage++
			console.log(this.result)
			if(this.result.length == 0) {
				this.getJobEnterPrisesList()
			} else {
				this.getJobEnterPrisesList()
			}
		} else {
			this.loadMoreStatus = 'nomore'
		}
		
	},
	methods: {
		init(){
			this.thisPage = 1 // 当前默认翻页
			this.thisAllPage = 1 //当前全部页面
			this.enterprisesList = [] // 企业列表
			this.isShowScreenList = false // 筛选菜单显示状态
			this.result = [] // 筛选结果数组
			this.screenList.title = '行类分类',
			this.screenList.data = [{ text: '不限', identity: 0, status: true }]
			this.screenResult = {}
		},
		// 获取列表信息
		getJobEnterPrisesList(){
			this.loadMoreStatus = 'loading'
			let screenList = {openid: getApp().globalData.openid, page: this.thisPage, ...this.screenResult}
			this.$api.getJobEnterPrisesList(screenList).then(res => {
				console.log(res.data)
				this.enterprisesList = [...this.enterprisesList, ...res.data.XXList]
				this.thisPage = res.data.CurrentPage
				this.thisAllPage = res.data.Allpage
				this.loadMoreStatus = 'loadmore'
				if(!this.enterprisesList.length || this.enterprisesList.length < 6) {
					this.loadMoreStatus = 'nomore'
				}
				
				// 组合筛选列表
				let tempScreenList = []
				for (let [index, item] of res.data.HYList.entries()) {
					tempScreenList.push({ text: item.Name, identity: item.ID, status: false }) 
				}
				this.screenList.data = [...this.screenList.data, ...tempScreenList]
			})
		},
		showScreenList() {
			this.isShowScreenList = !this.isShowScreenList;
		},
		selectScreenItem(index) {
			this.screenList.data.forEach(el => {
				el.status = false;
			});
			this.screenList.data[index].status = true;
			this.screenList.title = this.screenList.data[index].text;
			this.isShowScreenList = !this.isShowScreenList;
			var that = this;
			this.result.length = 0;
			this.screenList.data.forEach(el => {
				if (el.status) {
					that.result.push(el);
				}
			});
			if(this.screenList.data[index].identity) {
				this.screenResult = {YHID: this.screenList.data[index].identity}
			} else {
				this.screenResult = {}
			}
			// console.log(this.result)
			this.enterprisesList.length = 0
			this.getJobEnterPrisesList()

				

			// this.$emit('change',this.result)
		},
		goToCompanyShow(id) {
			uni.$u.route({
				url: 'pages/jobCompany/jobCompany',
				params: {
					id: id,
				}
			});
		},
		// 返回上一页面
		back(){
			uni.$u.route({
				type:'navigateBack',
				delta: 1,
			})
		},

		// show(i) {
		// 	console.log(i);
		// 	if (this.curIndex == i) {
		// 		this.curIndex = null;
		// 	} else {
		// 		this.curIndex = i;
		// 	}
		// },
		// selectItem(i, j) {
		// 	this.list1[j].data.forEach(el => {
		// 		el.status = false;
		// 	});
		// 	this.list1[j].data[i].status = true;
		// 	this.list1[j].title = this.list1[j].data[i].text;
		// 	//this.$set(this.list1[j].data[i],'status',true)
		// 	this.curIndex = null;
		// 	var that = this;
		// 	this.result.length = 0;
		// 	this.list1.forEach(el => {
		// 		el.data.forEach(el1 => {
		// 			if (el1.status) {
		// 				that.result.push(el1);
		// 			}
		// 		});
		// 	});
		// 	this.$emit('change', this.result);
		// }
	},
	components: {
		JobTabbar,
	}
};
</script>

<style lang="scss" scoped>
@import url('jobEnterprises.css');
@import 'jobEnterprises.scss';
</style>
